<template>
  <!-- <div class="left-info-top"></div> -->
  <el-tabs type="border-card">
    <el-tab-pane label="调度设置" v-if="!state.showGoint">
      <div class="left-info-body">
        <!-- 调度方式 -->
        <div class="dispach-type-box">
          <span class="dispach-title">调度方式</span>
          <div class="type-body">
            <span class="dispach-title1">调度模型：</span>
            <div class="modle-body">
              <el-radio-group v-model="state.radioModel" class="ml-4" @change="handleChangeType">
                <el-radio :label="1" size="small">规程调度</el-radio>
                <el-radio :label="2" size="small">优化调度</el-radio>
                <el-radio :label="3" size="small">指令调度</el-radio>
                <el-radio :label="4" size="small">不拦蓄</el-radio>
                <el-radio :label="5" size="small">蓄水</el-radio>
                <el-radio :label="6" size="small">维持现状出流</el-radio>
              </el-radio-group>
            </div>
          </div>
        </div>
        <!-- 切换调度方式对应框 -->
        <!-- 规程调度 -->
        <div class="show-dispach-box" v-if="state.radioModel == 1">
          <!-- 调度规则 -->
          <div class="dispach-rule-box">
            <span class="dispach-title">调度规则</span>

            <el-form-item label="规程调度模型" prop="disMid">
              <el-select
                v-model="state.disMid"
                placeholder="请选择"
                @change="handleChangeRuleDispatch"
              >
                <el-option
                  v-for="item in state.rulesDispatchModel"
                  :key="item.mid"
                  :label="item.modelName"
                  :value="item.mid"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="规程调度方案" prop="disScid">
              <el-select
                v-model="state.disScid"
                placeholder="请选择"
                @change="handleChangeRuleScheme"
              >
                <el-option
                  v-for="item in state.rulesDispatchScheme"
                  :key="item.id"
                  :label="item.scName"
                  :value="Number(item.id)"
                />
              </el-select>
            </el-form-item>
          </div>
          <!--具体参数  -->
          <div class="dispach-params-box">
            <span class="dispach-title">具体参数</span>
            <div class="params-show">
              <el-table border :data="state.rulesParamsArr" style="width: 100%" height="100%">
                <el-table-column
                  prop="wlevel"
                  label="控泄水位"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.wlevel" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="qmax"
                  label="控泄流量"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.qmax" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="zmkaidu"
                  label="闸门开度"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.zmkaidu" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="zmnum"
                  label="闸门数"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.zmnum" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="dkkaidu"
                  label="底孔开度"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.dkkaidu" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="dknum"
                  label="底孔数"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.dknum" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="yhdnum"
                  label="溢洪道数"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.yhdnum" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="porr"
                  label="porr"
                  align="center"
                  show-overflow-tooltip
                  width="100"
                >
                  <template #default="{ row }">
                    <el-input v-model="row.porr" :disabled="false"></el-input>
                  </template>
                </el-table-column>
                <el-table-column prop="porr2" label="porr2" align="center" show-overflow-tooltip>
                  <template #default="{ row }">
                    <el-input v-model="row.porr2" :disabled="false"></el-input>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </div>
        <!-- 优化调度 -->
        <div class="show-dispach-box" v-if="state.radioModel == 2">
          <!-- 调度规则 -->
          <div class="dispach-rule-box">
            <span class="dispach-title">调度规则</span>
            <el-form-item label="优化调度模型" prop="disMid">
              <el-select
                v-model="state.disMid"
                placeholder="请选择"
                @change="handleChangeRuleDispatch(val)"
              >
                <el-option
                  v-for="item in state.rulesDispatchModel"
                  :key="item.mid"
                  :label="item.modelName"
                  :value="item.mid"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="优化调度方案" prop="disScid">
              <el-select
                v-model="state.disScid"
                placeholder="请选择"
                @change="handleChangeOptimScheme"
              >
                <el-option
                  v-for="item in state.rulesDispatchScheme"
                  :key="item.id"
                  :label="item.scName"
                  :value="Number(item.id)"
                />
              </el-select>
            </el-form-item>
          </div>
          <!--具体参数  -->
          <div class="dispach-params-box">
            <span class="dispach-title">具体参数</span>
            <div class="params-show">
              <el-table border :data="state.optimParamsArr" style="width: 100%" height="100%">
                <el-table-column prop="pmKey" label="参数名" align="center" />
                <el-table-column prop="pmVl" label="参数值" align="center">
                  <template #default="{ row }">
                    <el-input v-model="row.pmVl"></el-input>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </div>
        <!-- 指令调度 -->
        <div class="show-dispach-box" v-if="state.radioModel == 3">
          <!-- 调度规则 -->

          <InstructDispach
            :scid="state.scidIns"
            :blkcd="state.blkcd"
            ref="InstructDispachRef"
            :insPro="state.insPro"
          />
        </div>
        <!-- 更多调度方式 -->
        <div
          class="show-dispach-box"
          v-if="
            state.radioModel == 14 ||
            state.radioModel == 10 ||
            state.radioModel == 6 ||
            state.radioModel == 7
          "
        >
          <!-- 调度规则 -->
          <!-- <span class="dispach-title1">调度设置：</span>
          <div class="modle-body">
            <el-radio-group v-model="state.radioModel" class="ml-4">
              <el-radio :label="4" size="small">不拦蓄</el-radio>
              <el-radio :label="5" size="small">蓄水</el-radio>
              <el-radio :label="6" size="small">维持现状出流</el-radio>
            </el-radio-group>
          </div> -->
        </div>
      </div>
    </el-tab-pane>
    <el-tab-pane label="基本条件" v-if="!state.showGoint">
      <div class="left-info-body">
        <div class="dispach-type-box1">
          <div class="dispach-rule-box">
            <span class="dispach-title">基础控制条件</span>
            <!-- <div class="type-body">
              <span class="dispach-title1">调度模型：</span>
            </div> -->
            <el-table border :data="state.baseCondArr" style="width: 100%; height: 200px">
              <el-table-column prop="condKey" label="参数名" align="center" />
              <el-table-column prop="condVl" label="参数值" align="center">
                <template #default="{ row }">
                  <div class="water-class" v-if="row.condKey == '洪水起调水位'">
                    <el-select
                      v-model="state.waterStart"
                      placeholder="请选择"
                      @change="handleChangeWaterStart"
                    >
                      <el-option
                        v-for="item in state.waterStartData"
                        :key="item.id"
                        :label="item.label"
                        :value="item.id"
                      />
                    </el-select>
                    <el-input
                      style="width: 100px"
                      v-model="row.condVl"
                      :disabled="false"
                    ></el-input>
                  </div>
                  <div v-else>
                    <el-input v-model="row.condVl" :disabled="false"></el-input>
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
      </div>
    </el-tab-pane>
    <el-tab-pane label="联合调度目标设置" v-if="state.showGoint">
      <el-table border :data="state.baseCondArr" style="width: 100%">
        <el-table-column prop="condKey" label="参数名" align="center" />
        <el-table-column prop="condVl" label="参数值" align="center" />
        <el-table-column prop="condVl" label="参数说明" align="center" />
      </el-table>
    </el-tab-pane>
  </el-tabs>
  <div class="bottom-btn-box">
    <el-button type="primary" @click="handleSaveItem">参数保存</el-button>
    <el-button type="warning" @click="handleJoinComput">参与试算</el-button>

    <el-button type="success" @click="handleResetParams">初始参数</el-button>
  </div>
</template>
<script setup>
import { ref, reactive, defineExpose, watch } from 'vue'
import {
  getResvs,
  getJointResvs,
  getRegsSchemes,
  getOptimSchemes,
  addManualDispatchScheme,
  getResvCond,
  getRegsRules,
  addDispatchScheme,
  editDispatchScheme,
  dispatchDetail,
  getOptimParams,
  // 规程调度
  regsSchemesAll,
  // 优化调度
  optimSchemesAll,
  //
  getResvFLevel,
  //
  getResvConds
} from '@/services/modules/dispatch-manage'
import InstructDispach from './cpns/instructDispach.vue'
const InstructDispachRef = ref(null)
const state = reactive({
  showGoint: false,
  waterStart: 0,
  waterStartData: [
    {
      id: 0,
      label: '当前水位'
    },
    {
      id: 1,
      label: '汛限水位'
    },
    {
      id: 2,
      label: '允许壅高水位'
    },
    {
      id: 3,
      label: '允许最高水位'
    }
  ],
  initData: [],
  scid: '',
  parentId: '',
  disScid: '',
  disMid: '',
  blkcd: '',
  //规程调度模型
  rulesDispatchModel: [],
  singleDataArr: [],
  baseCondArr: [],
  radioModel: 1,
  rulesDispatchScheme: [],
  optDispatchParams: [],
  rulesParamsArr: [],
  optimParamsArr: [],
  rowItem: {
    reservoirsItem: {
      optims: [
        {
          popNum: 1,
          iterNum: 1,
          mutProb: 1,
          crocProb: 1
        }
      ],
      rules: [
        {
          wlevel: 0,
          qmax: 0
        }
      ],
      conds: {
        flevel: 2,
        mlevel: 0,
        qs: 0,
        mxq: 0
      }
    }
  }
})
const emit = defineEmits(['emitSaveItem', 'emitTryScheme'])
/**
 * 洪水起调水位
 *
 */
const getResvFLevelList = (item) => {
  getResvFLevel({ levelKey: item, blkcd: state.blkcd, scid: state.scid }).then((res) => {
    if (res.code === 200) {
      state.baseCondArr.forEach((item, index) => {
        if (item.condKey == '洪水起调水位') {
          item.condVl = res.data.levelVl
        }
      })
    }
  })
}
const handleChangeWaterStart = (item) => {
  getResvFLevelList(item)
}

function handleClickModel(e) {
  // 流域id
  state.waterId = e.waterId
  console.log(e, '调度规则')

  //展示联合
  state.showGoint = e.showGoint
  state.parentId = e.parentId
  state.scid = e.scid
  state.scidIns = e.scidIns
  state.blkcd = e.blkcd
  state.blknm = e.blknm
  state.singleDataArr = e.singleData
  state.singleDataArr = state.singleDataArr.filter((item) => {
    return item.blkcd == e.blkcd
  })
  getResvCondsList(state.blkcd, state.scid)
  console.log('666', state.singleDataArr)
  state.radioModel = state.singleDataArr[0].disType

  state.rulesDispatchModel = state.singleDataArr[0].models
  // 初始化基本条件用
  state.initData = JSON.parse(JSON.stringify(state.singleDataArr[0].models[0].schemes[0].conds))
  // state.insPro = state.singleDataArr[0].models[0].schemes[0].ins
  if (state.singleDataArr[0].models[0].schemes[0].ins == undefined) {
    state.insPro = ''
  } else {
    state.insPro = JSON.parse(JSON.stringify(state.singleDataArr[0].models[0].schemes[0].ins))

  }

  // 调度模型
  handleChangeRuleDispatch(state.rulesDispatchModel[0].mid)
  // 调度方案
  state.rulesDispatchScheme = state.singleDataArr[0].models[0].schemes

  // 改变调度方案
  if (state.singleDataArr[0].disType == 1) {
    handleChangeRuleScheme(state.rulesDispatchScheme[0].id)
  } else if (state.singleDataArr[0].disType == 2) {
    handleChangeOptimScheme(state.rulesDispatchScheme[0].id)
  }

  // 选中调度方式
  // handleChangeType(state.radioModel)
}
defineExpose({ handleClickModel })
// 选择调度模型 state.disMid:调度模型id
function handleChangeRuleDispatch(val) {
  state.disMid = val
  // 根据调度模型id过滤 获取调度方案列表
}
/**
 * 查询水库基本条件
 */
const getResvCondsList = (blkcd, scid) => {
  getResvConds({ scid: scid, blkcd: blkcd }).then((res) => {
    if (res.code === 200) {
      state.baseCondArr = res.data
    }
  })
}
//
function handleSaveItem() {
  let paramsItem = {
    blkcd: state.blkcd,
    disType: state.radioModel,
    disScid: state.disScid,
    disMid: state.disMid,
    // 优化
    optims: state.optimParamsArr,
    // 规程
    rules: state.rulesParamsArr,
    // 控制条件
    conds: state.baseCondArr,
    // 试算集合
    trials: [],
    trialData: [],
    ins: InstructDispachRef.value?.state ? InstructDispachRef.value.state.ins : {}
  }
  emit('emitSaveItem', paramsItem)
}
function handleJoinComput() {
  let paramsItem = {
    trialName: `${state.blknm}试算方案`,
    scid: state.scid,
    blkcd: state.blkcd,
    disType: state.radioModel,
    disScid: state.disScid,
    disMid: state.disMid,
    optims: state.optimParamsArr,
    rules: state.rulesParamsArr,
    conds: state.baseCondArr,
    ins: InstructDispachRef.value?.state ? InstructDispachRef.value.state.ins : {}
  }
  emit('emitTryScheme', { paramsItem: paramsItem })
}
//初始参数
function handleResetParams() {
  handleChangeRuleScheme(state.disScid)
  handleChangeOptimScheme(state.disScid)
  // 初始基本条件
  console.log(state.initData, '初始')
  state.insPro = state.singleDataArr[0].models[0].schemes[0].ins
  getResvCondsList(state.blkcd, state.scid)
}
//改变规程调度
function handleChangeRuleScheme(item) {
  state.optimParamsArr = []
  state.rulesParamsArr = []
  state.disScid = item

  let flag = state.singleDataArr[0].models[0].schemes[0].rules
  // 如果原始数据有具体参数
  if (flag?.length > 0 && flag != undefined) {
    state.rulesParamsArr = JSON.parse(JSON.stringify(flag))
  } else {
    getRegsRules({ scid: item, blkcd: state.rowItem.blkcd }).then((res) => {
      if (res.code === 200) {
        state.rulesParamsArr = res.data
      }
    })
  }
}
//改变优化调度
function handleChangeOptimScheme(item) {
  state.optimParamsArr = []
  state.rulesParamsArr = []
  state.disScid = item
  // 如果原始数据有具体参数

  let falg = state.singleDataArr[0].models[0].schemes[0].optims
  if (falg?.length > 0 && falg != undefined) {
    state.optimParamsArr = JSON.parse(JSON.stringify(falg))
  } else {
    getOptimParams({ scid: item, blkcd: state.rowItem.blkcd }).then((res) => {
      if (res.code === 200) {
        state.optimParamsArr = res.data
      }
    })
  }
}
//
// 选择调度方式,获取对应的断面的调度模型及方案
// val:调度模型
function handleChangeType(val) {
  state.radioModel = val
  switch (val) {
    // 规程
    case 1:
      regsSchemesAll({ blkcd: state.blkcd, zoneId: state.waterId }).then((res) => {
        if (res.code == 200) {
          state.rulesDispatchModel = res.data[0].models

          state.initData = JSON.parse(JSON.stringify(state.rulesDispatchModel[0]?.schemes[0].conds))
          // 默认选择第一个调度模型
          handleChangeRuleDispatch(state.rulesDispatchModel[0].mid)
          // 调度方案
          state.rulesDispatchScheme = state.rulesDispatchModel[0].schemes
          // 改变调度方案
          handleChangeRuleScheme(state.rulesDispatchScheme[0].id)
        }
      })
      break
    // 优化
    case 2:
      optimSchemesAll({ blkcd: state.blkcd, zoneId: state.waterId }).then((res) => {
        if (res.code == 200) {
          state.rulesDispatchModel = res.data[0].models

          state.initData = JSON.parse(JSON.stringify(state.rulesDispatchModel[0]?.schemes[0].conds))
          // 默认选择第一个调度模型
          handleChangeRuleDispatch(state.rulesDispatchModel[0].mid)
          // 调度方案
          state.rulesDispatchScheme = state.rulesDispatchModel[0].schemes
          // 改变调度方案
          handleChangeOptimScheme(state.rulesDispatchScheme[0].id)
        }
      })
      break

    // 指令
    case 3:
      state.optimParamsArr = []
      state.rulesParamsArr = []
    default:
      break
  }
}
</script>
<style lang="less" scoped>
.content-table {
  display: flex;
  justify-content: left;
  align-items: center;
  margin-bottom: 10px;
  // height: 50px;
  :deep(.el-input) {
    width: 80px;
    margin-right: 15px;
  }
  // span:nth-of-type(1) {
  //   margin-left: 10px;
  // }
  span {
    margin: 0 10px;
  }
}
.bottom-btn-box {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 60px;
  box-sizing: border-box;
  padding-right: 10px;
  width: 100%;
  // background-color: #409eff;
}
.el-tabs {
  // height: 100%;
  height: calc(100% - 62px);
  // overflow-y: auto;
  :deep(.el-tabs__content) {
    height: calc(100% - 60px);
  }
  :deep(.el-tab-pane) {
    height: 100%;
  }
  :deep(.el-tabs__item) {
    font-size: 15px;
    font-weight: 550;
  }
}
// .left-info-top {
//   height: 39px;
//   border-bottom: 1px solid #7b7979d7;
// }
.left-info-body {
  // height: 420px;
  height: 100%;
  .dispach-title {
    height: 30px;
    line-height: 40px;
    font-size: 15px;
    color: #409eff;
    // font-weight: 600;
  }
  .dispach-title1 {
    white-space: nowrap;
    height: 40px;
    line-height: 40px;
    font-size: 15px;
    color: #545252d7;
    // font-weight: 600;
  }
  .modle-body {
    .el-radio {
      margin-right: 15px;
    }
  }
  .input-with {
    width: 200px !important;
  }
  .type-body {
    display: flex;
    align-items: center;
    height: 40px;
  }
  // 调度方式
  .dispach-type-box {
    // margin-bottom: 20px;
    box-sizing: border-box;
    // padding-left: 10px;
    height: 80px;
    // background-color: rebeccapurple;
  }
  .dispach-type-box1 {
    box-sizing: border-box;
    height: 100%;
    .dispach-rule-box {
      height: 100%;
      // :deep(.el-form-item) {
      //   margin-bottom: 10px !important;
      // }
      .dispach-title {
        display: block;
        height: 30px;
        line-height: 30px;
      }

      .el-table {
        height: calc(100% - 30px) !important;
        .water-class {
          display: flex;
        }
      }
    }
  }
  // 调度方式对应框
  .show-dispach-box {
    box-sizing: border-box;
    // padding-left: 10px;
    // padding: 0 10px;
    height: calc(100% - 90px);
    // background-color: red;
    .dispach-rule-box {
      // margin-bottom: 0px;

      :deep(.el-form-item) {
        margin-bottom: 10px !important;
      }
    }
    .dispach-params-box {
      height: calc(100% - 125px);
      overflow: hidden;
      // background-color: #409eff;
      .params-show {
        // height: 150px;
        height: calc(100% - 30px);
        overflow-y: auto;
        // background-color: red;
        .params-show-item {
          display: flex;
          align-items: center;
          height: 30px;
          margin-bottom: 5px;
          .magLeft {
            margin-left: 30px;
          }
        }
      }
    }
  }
}
</style>
